import { AbstractDefinition, MenuToConfigMappingType } from './AbstractDefinition';
import AbstractController from './AbstractController';
import AbstractDesignerController from './AbstractDesignerController';
import { MenuInfo } from '../../designer/right/MenuType';
import { ColorFilter, Data, Optimize, SettingOne, Theme, Devices } from '@icon-park/react';
import { lazy } from 'react';

const AnimationConfig = lazy(() => import('../../comps/common-component/animation-config/AnimationConfig'));
const ThemeConfig = lazy(() => import('../../comps/common-component/theme-config/ThemeConfig'));
const BaseInfo = lazy(() => import('../../comps/common-component/base-info/BaseInfo'));
const DataConfig = lazy(() => import('../../comps/common-component/data-config/DataConfig'));
const FilterConfig = lazy(() => import('../../comps/common-component/filter-config/FilterConfig'));

export default abstract class AbstractDesignerDefinition<
  C extends AbstractController = AbstractDesignerController,
  P = any,
> extends AbstractDefinition<C, P> {
  getMenuList(): Array<MenuInfo> {
    return [
      {
        icon: SettingOne,
        name: '基础',
        key: 'base',
      },
      {
        icon: Optimize,
        name: '样式',
        key: 'style',
      },
      {
        icon: Data,
        name: '数据',
        key: 'data',
      },
      {
        icon: ColorFilter,
        name: '滤镜',
        key: 'filter',
      },
      {
        icon: Devices,
        name: '设备绑定',
        key: 'device',
      },
      {
        icon: Theme,
        name: '主题',
        key: 'theme',
      },
    ];
  }

  getMenuToConfigContentMap(): MenuToConfigMappingType {
    return {
      base: BaseInfo,
      data: DataConfig,
      animation: AnimationConfig,
      theme: ThemeConfig,
      filter: FilterConfig,
    };
  }
}
